import Vue from 'vue'
import VueRouter from 'vue-router'
// 导入登录组件
//import Login from "../components/Login";
// 导入Home 组件
//import Home from "../components/Home";
// 导入Welcome 组件
//import Welcome from "../components/Welcome";
// 改造成懒加载
const Login = () => import(/* webpackChunkName: "login_home_welcome" */ '../components/Login')
const Home = () => import(/* webpackChunkName: "login_home_welcome" */ '../components/Home')
const Welcome = () => import(/* webpackChunkName: "login_home_welcome" */ '../components/Welcome')

// 导入 Users 组件
// import Users from "../components/user/Users";
// 导入权限列表 组件
// import Rights from "../components/power/Rights";
// 导入角色列表 组件
// import Roles from "../components/power/Roles";
// 改造成懒加载
const Users = () => import(/* webpackChunkName: "users_rights_roles" */ '../components/user/Users')
const Rights = () => import(/* webpackChunkName: "users_rights_roles" */ '../components/power/Rights')
const Roles = () => import(/* webpackChunkName: "users_rights_roles" */ '../components/power/Roles')

// 导入商品分类 组件
import Cate from "../components/goods/Cate";
// 导入商品分类参数 组件
import Params from "../components/goods/Params";
// 改造成懒加载
//const Cate = () => import(/* webpackChunkName: "Cate_Params" */ '../components/goods/Cate')
//const Params = () => import(/* webpackChunkName: "Cate_Params" */ '../components/goods/Params')

// 导入商品列表组件
//import GoodsList from "../components/goods/List";
// 导入增加商品名称组件
//import Add from "../components/goods/Add";
// 改造成懒加载
const GoodsList = () => import(/* webpackChunkName: "GoodsList_Add" */ '../components/goods/List')
const Add = () => import(/* webpackChunkName: "GoodsList_Add" */ '../components/goods/Add')

// 导入订单组件
//import Order from "../components/order/Order";
// 导入报表功能
//import Report from "../components/report/Report";
// 改造成懒加载
const Order = () => import(/* webpackChunkName: "Order_Report" */ '../components/order/Order')
const Report = () => import(/* webpackChunkName: "Order_Report" */ '../components/report/Report')

import {renderThumbStyle} from "element-ui/packages/scrollbar/src/util";

Vue.use(VueRouter)

const routes = [
    // 路由重定向,当访问/,就会重定向到/login
    {
        path: '/',
        redirect: '/login'
    },
    // 定义登录路由规则
    {
        path: '/login',
        component: Login
    },
    // 定义Home的路由规则
    {
        path: '/home',
        component: Home,
        redirect: '/welcome',
        children: [
            {
                path: '/welcome',
                component: Welcome
            },
            /* 用户管理 */
            {
                path: '/users',
                component: Users
            },
            /* 权限管理 */
            {
                path: '/rights',
                component: Rights
            },
            /* 角色管理 */
            {
                path: '/roles',
                component: Roles
            },
            /* 商品分类 */
            {
                path: '/categories',
                component: Cate
            },
            /* 商品分类参数 */
            {
                path: '/params',
                component: Params
            },
            /* 商品列表 */
            {
                path: '/goods',
                component: GoodsList
            },
            /* 增加商品 */
            {
                path: '/goods/add',
                component: Add
            },
            /* 订单 */
            {
                path: '/orders',
                component: Order
            },
            /* 报表 */
            {
                path: '/reports',
                component: Report
            }
        ]
    }
]

const router = new VueRouter({
    routes
})
// 挂载路由导航守卫
// to 将要访问的路径
// from 代表从哪个路径跳转而来
// next 是个函数，表示放行 next() 放行  next('/login') 强制跳转
router.beforeEach((to, from, next) => {
    // 如果用户访问的登录页，直接放行
    if (to.path === '/login') return next();
    // 从 sessionStorage 中获取到保存的 token 值
    const tokenstr = window.sessionStorage.getItem('token')
    // 没有 token，强制跳转到登录页
    if (!tokenstr) return next('/login')
    next()
})

export default router
